<template lang="html">

<section class="banner">
  <div class="block home_wrap">
    <el-carousel class="my-swiper-box">
      <!-- for循环轮播 -->
      <el-carousel-item :key='1' class='home_carousel'>
        <a href="" title="">
          <img src="../../../assets/img/banner_1.jpg" alt="">
        </a>
      </el-carousel-item>
      <el-carousel-item :key='1' class='home_carousel'>
        <a href="" title="">
          <img src="../../../assets/img/banner_1.jpg" alt="">
        </a>
      </el-carousel-item>
    </el-carousel>
  </div>
</section>

</template>

<script lang="js">
  export default  {
    name: 'banner',
    props: [],
    mounted() {

    },
    data() {
      return {

      }
    },
    methods: {

    },
    computed: {

    }
}
</script>

<style scoped lang="scss">
.banner {
}
$Height:300px;
.home_wrap {
  position: relative;
  height: $Height;
  .my-swiper-box {
    width: 100%;
    overflow: hidden;
  }
  .home_carousel {
    border-top: 2px solid #009fe2;
    width: 100%;
    a {
      height: $Height;
      img {
        width: 100%;
        height: 100%;
      }
    }
  }
}

</style>
